
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>好好吃商城</title>
 <link type="text/css" href="css/css.css" rel="stylesheet" />
 <script type="text/javascript" src="js/vue.js"></script>
 <script type="text/javascript" src="js/jquery.js"></script>

 <script type="text/javascript" src="js/js.js"></script>

 <script src="js/wb.js" type="text/javascript" charset="utf-8"></script>

 <script src="js/MagicZoom.js" type="text/javascript"></script>

</head>

<body>
<div class="mianCont" id="app">
 <div class="top">
  <span>您好！欢迎来到好好吃商城</span>
  <span class="topRight">
    <a href="vip.html">好好吃</a>&nbsp;|
    <a href="order.html">我的订单</a>&nbsp;|
    <a href="vip.html">会员中心</a>&nbsp;|
    <a href="#">联系我们</a>
   </span>
 </div><!--top/-->
 <div class="lsg">
  <h1 class="logo"><a href="index.html"><img src="img/logo.png" width="217" height="90" /></a></h1>
  <form action="#" method="get" class="subBox">
   <div class="subBoxDiv">
    <input type="text" class="subLeft" id="sub"/>
    <input type="image" id="sublert2" src="img/subimg.png" width="63" height="34" class="sub" />
    <div class="hotWord">
     热门搜索：
     <a href="#">辣条</a>&nbsp;
     <a href="#">大礼包</a> &nbsp;
     <a href="#">手撕面包</a>&nbsp;
     <a href="#">鸭脖</a>  &nbsp;
     <a href="#">每日坚果</a> &nbsp;
     <a href="#">芒果干</a>&nbsp;
    </div><!--hotWord/-->
   </div><!--subBoxDiv/-->
  </form><!--subBox/-->
  <div class="gouwuche">
   <div class="gouCar">
    <img src="img/gouimg.png" width="19" height="20" style="position:relative;top:6px;" />&nbsp;|&nbsp;
    <strong class="red">{{tot2}}</strong>&nbsp;件&nbsp;|
    <strong class="red">￥ {{tot}}元</strong>
    <a href="order.html">去结算</a> <img src="img/youjian.jpg" width="5" height="8" />
   </div><!--gouCar/-->
   <div class="myChunlv">
    <a href="vip.html"><img src="img/mychunlv.jpg" width="112" height="34" /></a>
   </div><!--myChunlv/-->
  </div><!--gouwuche/-->
 </div><!--lsg/-->
 <div class="pnt">
  <div class="pntLeft">
   <h2 class="Title">所有商品分类

   </h2>
  </div><!--pntLeft/-->
  <div class="pntRight">
   <ul class="nav">
    <li><a href="index.html">商城首页</a></li>
    <li class="navCur"><a href="product.html">促销中心</a></li>
    <li><a href="vip.html">会员中心</a></li>
    <li><a href="help.html">帮助中心</a></li>
    <div class="clears"></div>
    <div class="phone">TEL：021-12345678</div>
   </ul><!--nav/-->
  </div><!--pntRight/-->
  <div class="clears"></div>
 </div><!--pnt/-->
 <div class="positions">
  当前位置：<a href="index.html">首页</a> &gt; <a href="#" class="posCur">促销商品</a>
 </div><!--positions/-->
 <div class="cont">
  <div class="contLeft">
   <ul class="leftPorNav">
    <li><a href="product.html">镇店爆款</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods" @click="gooou(item.id)" v-if="item.type=='镇店爆款'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">量贩专区</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='量贩专区'">{{item.goodsName}}</a>

     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">坚果炒货</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='坚果炒货'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">肉类卤味</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='肉类卤味'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">干果蜜钳</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='干果蜜钳'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">糕点点心</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods" @click="gooou(item.id)"v-if="item.type=='糕点点心'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
    <li><a href="product.html">方便素食</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='方便素食'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->

    </li>
    <li><a href="product.html"> 冲茶茶饮</a>
     <div class="chilInPorNav">
      <a href="#" v-for="item in goods"@click="gooou(item.id)"v-if="item.type=='冲茶茶饮'">{{item.goodsName}}</a>
     </div><!--chilLeftNav/-->
    </li>
   </ul><!--InPorNav/-->
  </div><!--contLeft/-->
  <div class="contRight" style="border:0;">
   <div class="proBox">
    <div id="tsShopContainer">
     <div id="tsImgS"><img width="300" height="300" v-bind:src="ds.goodsImg" /></a></div>

     <img class="MagicZoomLoading" width="16" height="16" src="img/loading.gif" alt="Loading..." />


    <!-- <script src="js/ShopShow.js">
      不知道有啥用
     </script>-->


    </div><!--tsShopContainer/-->
    <div class="proBoxRight">
     <h3 class="proTitle">{{ds.goodsName}}</h3>
     <div>商品编号：{{ds.id}} </div>
     <div>会员价：<strong class="red">{{ds.goodsPrice}}</strong>&nbsp;元 </div>
     <div>单位：袋 </div>
     <div>库存：<strong class="red">[有货] </strong> 从江西发货</div>

     <div class="shuliang2">
      数量： <input id="shli"  type="text" value="1" v-model="num"/>
     </div><!--shuliang2/-->
     <div class="gc">
      <a href="#"><img id="goumai" src="img/goumai.png" width="117"  height="36" /></a>&nbsp;&nbsp;
      <a href="#"><img id="gowuche" src="img/gouwuche.jpeg" width="117"  height="36" /></a>&nbsp;&nbsp;
      <a href="#"><img id="shoucang" src="img/shoucang.png" width="117" height="36" /></a>
     </div><!--gc/-->
    </div><!--proRight/-->
    <div class="clears"></div>
   </div><!--proBox/-->
   <ul class="fangyuan">
    <li>商品描述</li>
    <li>商品参数</li>
    <li>商品详情</li>
    <li>商品晒图</li>
    <div class="clears"></div>
   </ul><!--fangyuan/-->
   <div class="fangList">
    <div class="fangPar">
     商品ID：{{ds.id}}<br />
     商品名称：{{ds.goodsName}}<br/>
     商品价格：{{ds.goodsPrice}}<br />
     商品详情：{{ds.goodsDetails}}<br />
     上架时间：{{ds.updateDate}}<br />
     商品类型：{{ds.type}}<br />
     店铺类型：{{ds.flag}}<br />
    </div><!--fangPar/-->

   </div><!--fangList/-->
   <div class="fangList">
    商品名称：{{ds.goodsName}}<br/>
    商品价格：{{ds.goodsPrice}}<br />
   </div><!--fangList/-->
   <div class="fangList">
    商品详情：{{ds.goodsDetails}}<br />
    上架时间：{{ds.updateDate}}<br />
    商品类型：{{ds.type}}<br />
   </div><!--fangList/-->
   <div class="fangList">
    <img v-bind:src="ds.goodsImg" width="132" height="129" /><br /><br />

   </div><!--fangList/-->
  </div><!--contRight/-->
  <div class="clears"></div>
 </div><!--cont/-->
 <div class="inHelp">
  <div class="inHLeft">
   <h4>帮助中心</h4>
   <ul class="inHeList">
    <li><a href="help.html">购物指南</a></li>
    <li><a href="help.html">支付方式</a></li>
    <li><a href="help.html">售后服务</a></li>
    <li><a href="#">企业简介</a></li>
    <div class="clears"></div>
   </ul><!--inHeList/-->
  </div><!--inHLeft/-->
  <div class="inHLeft">
   <h4>会员服务</h4>
   <ul class="inHeList">
    <li><a href="reg.html">会员注册</a></li>
    <li><a href="login.html">会员登录</a></li>
    <li><a href="order.html">购物车</a></li>
    <li><a href="order.html">我的订单</a></li>
    <div class="clears"></div>
   </ul><!--inHeList/-->
  </div><!--inHLeft/-->
  <div class="inHRight">
   <h4>全国统一免费服务热线</h4>
   <div class="telBox">400-0000-0000</div>
   <div class="weibo">

   </div>
  </div><!--inHRight/-->
  <div class="clears"></div>
 </div><!--inHelp/-->
 <div class="footer">
  <p>
   <a href="#">进入好好吃官网</a>&nbsp;|&nbsp;
   <a href="index.html">商城首页</a>&nbsp;|&nbsp;
   <a href="product.html">促销中心</a>&nbsp;|&nbsp;
   <a href="order.html">我的订单</a>&nbsp;|&nbsp;
   <a href="#">新闻动态</a>&nbsp;|&nbsp;
   <a href="vip.html">会员中心</a>&nbsp;|&nbsp;
   <a href="help.html">帮助中心</a>
  </p>
  <p>
   版权所有：好好吃有限公司 版权所有  Copyright 2010-2015   ICP备00000000号
  </p>
 </div><!--footer/-->
</div><!--mianCont/-->

<script type="text/javascript" src="js/config.js"></script>
<script type="text/javascript"src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/http.js"></script>
<script type="text/javascript">


 var app=new Vue({
  el:"#app",
  data:{
   goods:[],
   dod:[],
   tot:0,
   tot2:0,
   user:[],
   ds:[],
   num:1//商品数量
  },
  methods:{

            gooou(id){

            $.ajax({
               url:config.GOODS_GETBYID,
               type:"post",
               dataType:"json",
               data:{"goodsId":id
               },
               success:function (data) {

                //console.log(data.data)
                app.ds=data.data

               }
           })

   }
  }
 })

 //加载页面自动执行
 $(document).ready(function () {
      $.ajax({
       url:config.GOODS_GETALL,
       type:"post",
       dataType:"json",
       data:{
       },
       success:function (data) {
        app.goods=data.data

       }
      })

      id=$.cookie('name');

            $.ajax({
             url:config.GOODS_GETBYID,
             type:"post",
             dataType:"json",
             data:{"goodsId":id
             },
             success:function (data) {

              //console.log(data.data)
              app.ds=data.data


             }
            })


//登陆检查 获取使用者ID
  $.ajax({
   url:config.USER_LOGINCHECK,
   type:"post",
   dataType:"json",
   data:{

   },
   success:function (data) {
    app.user=data.data

   }

  })

  name2 = $.cookie('name2');
  //购物车查询
  $.ajax({
   url: config.CAR_GETBYXH,
   type: "post",
   dataType: "json",
   data: {
    "userXh": name2

   },
   success: function (data) {
    app.dod = data.data
    for (i = 0; i < app.dod.length; i++) {
     app.tot = app.tot + parseInt(app.dod[i].goodsPrice) * parseInt(app.dod[i].carNum)
app.tot2=app.dod.length
    }
   }

  })

 })
 $("#goumai").click(function (){
  var data={
   "userId":app.user.id,
   "userXh":app.user.xh,
   "goodsId":app.ds.id,
   "carNum":app.num,
   "carPrice":app.ds.goodsPrice
  }
  console.log(data)
  $.ajax({
   url:config.CAR_ADD,
   type:"post",
   dataType:"json",
   contentType : 'application/json',
   data:JSON.stringify(data),
   success:function (data) {

    $(window).attr('location', 'order.html');

   }
  })
 })
$("#gowuche").click(function (){

 var data={
  "userId":app.user.id,
  "userXh":app.user.xh,
  "goodsId":app.ds.id,
  "carNum":app.num,
  "carPrice":app.ds.goodsPrice
 }
 console.log(data)
 $.ajax({
  url:config.CAR_ADD,
  type:"post",
  dataType:"json",
  contentType : 'application/json',
  data:JSON.stringify(data),
  success:function (data) {

   alert("添加购物车成功")

  }
 })

 //购物车查询
 $.ajax({
  url: config.CAR_GETBYXH,
  type: "post",
  dataType: "json",
  data: {
   "userXh": name2

  },
  success: function (data) {
   app.dod = data.data
   for (i = 0; i < app.dod.length; i++) {
    app.tot = app.tot + parseInt(app.dod[i].goodsPrice) * parseInt(app.dod[i].carNum)
app.tot2=app.dod.length
   }
  }

 })

})

 //收藏添加
 $("#shoucang").click(function (){
  var data={
   "userId":app.user.id,
   "userXh":app.user.xh,
   "goodsId":app.ds.id,
   "favorPrice":app.ds.goodsPrice
  }
  console.log(data)
/*  $.ajax({
   url:config.FAVOR_ADD,
   type:"post",
   dataType:"json",
   contentType : 'application/json',
   data:JSON.stringify(dataa),
   success:function (dataa) {

    alert("添加收藏成功")

   }
  })*/
  postApi(config.FAVOR_ADD,data,function (res){
   alert("添加收藏成功")
  })
 })

 $('#sublert2').click(function (){

//通过ID查询商品
  $.ajax({
   url:config.GOODS_GETALL,
   type:"post",
   dataType:"json",
   data:{
    "value":$("#sub").val()
   },
   success:function (data) {



    if (data.data==""){
     alert("没有此商品")
    }else {
     var id=data.data[0].id;
     $.cookie('name',id,{path:'/proinfo.html'});
     $(window).attr('location', 'proinfo.html');
    }
   }
  })
 })

</script>
</body>
</html>
